<%--
  Created by IntelliJ IDEA.
  User: Mucd
  Date: 2021/6/25
  Time: 22:27
  To change this template use File | Settings | File Templates.
--%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>修改数据</title>
    <link rel="stylesheet" href="<c:url value="static/layui/css/layui.css"/>">
    <script src="<c:url value="static/layui/layui.js"/>"></script>
    <style>
        .layui-container {
            width: 650px !important;
        }

        .h1txt {
            text-align: center;
        }
    </style>
</head>
<body>

<h1 class="h1txt">修改数据</h1>
<br>
<br>
<br>
<div class="layui-container">
    <form class="layui-form"  method="post" action="Update"> <!-- 提示：如果你不想用form，你可以换成div等任何一个普通元素 -->
        <div class="layui-form-item">
            <label class="layui-form-label">要修改的ID</label>
            <div class="layui-input-block">
                <% String id = request.getParameter("id"); %>
                <input type="text" readonly="readonly" name="getId" placeholder="ID" value="<%=id%>" autocomplete="off"
                       class="layui-input">
            </div>
        </div>

        <%--姓名--%>
        <div class="layui-form-item">
            <label class="layui-form-label">Name</label>
            <div class="layui-input-block">
                <input type="text" name="setName" lay-verify="required" placeholder="请输入要修改该的姓名" autocomplete="off"
                       class="layui-input">
            </div>
        </div>

        <%--性别--%>
        <div class="layui-form-item">
            <label class="layui-form-label">性别</label>
            <div class="layui-input-block">
                <input type="radio" name="setGender" value="男" title="男">
                <input type="radio" name="setGender" value="女" title="女" checked>
            </div>
        </div>
        <%--年龄--%>
        <div class="layui-form-item">
            <label class="layui-form-label">年龄</label>
            <div class="layui-input-inline">
                <label>
                    <select lay-verify="required" required name="setAge">
                        <option value="">选择年龄</option>
                        <option selected value="17">17</option>
                        <option value="18">18</option>
                        <option value="19">19</option>
                        <option value="20">20</option>
                        <option value="21">21</option>
                    </select>
                </label>
            </div>
        </div>
        <%--地址--%>
        <div class="layui-form-item">
            <label class="layui-form-label">城市</label>
            <div class="layui-input-inline">
                <label>
                    <select lay-verify="required" required name="setAddress">
                        <option value="">选择城市</option>
                        <option selected value="北京">北京</option>
                        <option value="北京">天津</option>
                        <option value="河北省">河北省</option>
                    </select>
                </label>
            </div>
        </div>

        <%--QQ--%>
        <div class="layui-form-item">
            <label class="layui-form-label">QQ</label>
            <div class="layui-input-block">
                <input type="text" name="setQQ" lay-verify="required|number" placeholder="请输入要修改该的QQ" autocomplete="off"
                       class="layui-input">
            </div>
        </div>

        <%--邮箱--%>
        <div class="layui-form-item">
            <label class="layui-form-label">email</label>
            <div class="layui-input-block">
                <input type="text" name="setEmail" lay-verify="required|email" placeholder="请输入要修改该的邮箱"
                       autocomplete="off" class="layui-input">
            </div>
        </div>

        <%--确定修改--%>
        <div class="layui-form-item">
            <div class="layui-input-block">
                <button class="layui-btn btn-warning" id="btn" lay-submit lay-filter="*">修改</button>
                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
            </div>
        </div>
    </form>

</div>
<script>
    layui.use('form', function () {
        var form = layui.form;

        //各种基于事件的操作，下面会有进一步介绍
    });

    //加载效果
    $('#btn').click(function (){
        layui.use('layer', function () {
            let index = layer.load(0, {shade: false}); //0代表加载的风格，支持0-2
            //loading层

            /*            var index = layer.load(1, {
                            shade: [0.1, '#fff'] //0.1透明度的白色背景
                        });*/
            //小tips
            layer.tips('正在修改....', '....', {
                tips: [1, '#3595CC'],
                time: 4000
            });
        })
    })

   function loading(){
       layui.use('layer', function () {
           var index = layer.load(0, {shade: false}); //0代表加载的风格，支持0-2
           //loading层

           /*            var index = layer.load(1, {
                           shade: [0.1, '#fff'] //0.1透明度的白色背景
                       });*/
           //小tips
           layer.tips('正在加载', '吸附元素选择器', {
               tips: [1, '#3595CC'],
               time: 4000
           });
       })
   }
</script>

</body>
</html>
